// 路由鉴权实现 : 自己封装 AuthComponent 路由鉴权高阶组件，实现未登录拦截，并跳转到登录页面
// 实现思路：
// 1. 判断token是否存在
// 2. token存在 直接正常渲染
// 3. token不存在 重定向到登录页面
// 4. 将需要鉴权的页面路由配置，替换为 AuthComponent 组件渲染

// 高阶组件：把一个组件当成另外一个组件的参数传入，然后通过一定的判断，返回新的组件

import { getToken } from '@/utils'
import { Navigate } from 'react-router-dom' // 引入

function AuthComponent({ children }) {
  const isToken = getToken()
  if (isToken) {
    return <>{children}</>
  } else {
    return <Navigate to="/login" replace />
  }
}

// <AuthComponent> <Layout/> </AuthComponent>
// 登录：<><Layout/></>
// 非登录：<Navigate to="/login" replace />

export { AuthComponent }
